<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

		<script type="text/javascript" src="mootools-1.2.1-core.js"></script>
		<script type="text/javascript" src="../MooWindowSession-0.1.1.js"></script>
		
		<link rel="stylesheet" href="screen.css" type="text/css" media="screen" charset="utf-8" />
		
		<script type="text/javascript" charset="utf-8">
			//<![CDATA[
				window.addEvent('domready', function() {
					var Session = new MooWindowSession();
					var cv = $('current-value');
					var cv2 = $('current-value2');
					
					if(Session.get() && $type(Session.get()) == 'string') cv.set('text', Session.get());
					if(Session.get() && $type(Session.get()) == 'object') cv2.set('text', JSON.encode(Session.get()));
					
					$('save').addEvent('click', function(e) {
						e.stop();

						Session.set($('text').get('value'));
						cv.set('text', Session.get());
					});
					
					$('clear').addEvent('click', function(e) {
						e.stop();
						
						Session.empty();
						cv.set('text', 'Session clear');
					});

					$('save2').addEvent('click', function(e) {
						e.stop();

						Session.set({
							a: 'Howdy!',
							b: 'Hi there!',
							c: 'How you doing?'
						});
						cv2.set('text', JSON.encode(Session.get()));
					});

					$('clear2').addEvent('click', function(e) {
						e.stop();
						
						Session.empty();
						cv2.set('text', 'Session clear');
					});

				});
		    //]]>
		</script>
		
		<title>MooWindowSession</title>
	</head>
	
	<body>
		<div id="wrapper">
			<div id="head">
				<h1>MooWindowSession</h1>
				<small>&laquo; <a title="Go back to the article" href="http://blog.olicio.us/2008/12/29/moowindowsession/">Go back to the article</a></small>
			</div>

			<form id="s" action="" method="get" accept-charset="utf-8">
				<h3>String</h3>
				<h4>Set a session value</h4> 

				<p>
					<input type="text" id="text" value="" />
					<button id="save">Save session</button> 
					<button id="clear">Clear session</button>
				</p>
				
				<h4>Current session value:</h4> 
				<pre id="current-value">Session clear</pre>

				<p>Check the value on a <a href="index-1.html">different page</a></p>
				
				<h3>Object</h3>
				
				<h4>Set a session value</h4> 
				<p>
					<button id="save2">Save session</button> 
					<button id="clear2">Clear session</button>
				</p>
				
				<h4>Current session value:</h4>
				<pre id="current-value2">Session clear</pre>

				<p>Check the value on a <a href="index-1.html">different page</a></p>
			</form>


		</div>
	</body>
</html>